<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>购物车</title>

<link rel="stylesheet" href="./index.css" />

</head>
<body>

<div id="app">
	<img src="img/yao_logo.png">
	<h3>全部商品{{length}}</h3>
	<div class="biaoti" >
		<ul  >
			
			<li> <input type="checkbox" id="sure" v-model="fv" @click="sd"  ><label for="checkbox">全选</label></li>
			<li>商品</li>
			<li>单价</li>
			<li>数量</li>
			<li>小计</li>
			<li>操作</li>
		</ul>
	</div>
	<div class="liebiao" id="list">
		<ul id="fff" class="et"  v-for="(e,index) in we">
			<li> <input type="checkbox" id="be" v-model="e.checked" @click="wq(index)"></li>
						  
			<li><img :src="e.url"></li>
			<li>{{e.message}}</li>
			<li>{{e.price}}</li>
			<li style="margin-right: -20px;"><button v-on:click="subtract(index)">-</button>
				<input type="text" value="0" size="1" id="ef" v-model="e.num">
				<button v-on:click="add(index)">+</button>
			</li>
			<li>{{wer(index)}}</li>
			<li @click="shanchu(e)">删除</li>
			
		</ul>
	   
	   <div v-if="!we.length">当前没有商品，请添加商品。</div>
	   <div id="aq"  :class={ghj:but}>
			<span > 已选择{{sde()}}件商品</span>  <span class="weq">合计{{wry()}}</span> <button  @click="ed">清空购物车</button><button class="jixu" type="button"><a href="shou.html">继续购物</a></button>
	   </div>
		
	</div>
</div>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.11.3/jquery.js"></script>
<script type="text/javascript"  src="./vue.js"></script>
<script src="./index.js"></script>
</body>
</html>